import Vue from "vue";
import VueRouter from "vue-router";
import LayoutRouterView from "@/layout/routerView/index.vue";

Vue.use(VueRouter);

/*
* meta: {
	icon 设置该路由的图标
	title 设置该路由的标题
	isHide 是否显示该路由
	keepAlive 是否缓存
* }
*/

const routes = [
  {
    path: "/",
    redirect: "/home",
    name: "/",
    component: () => import("@/layout/index.vue"),
    children: [
      {
        path: "/home",
        name: "home",
        component: () => import("@/views/home/index.vue"),
        meta: { icon: "el-icon-s-home", title: "首页" },
      },
      {
        path: "/table",
        name: "table",
        component: LayoutRouterView,
        meta: { icon: "el-icon-s-home", title: "表格" },
        children: [
          {
            path: "/table/page",
            name: "tablePage",
            component: () => import("@/views/table/page.vue"),
            meta: { title: "分页" },
          },
          {
            path: "/table/page2",
            name: "tablePage2",
            component: () => import("@/views/table/page2.vue"),
            meta: { title: "分页2" },
          },
          {
            path: "/table/row",
            name: "tableRow",
            component: () => import("@/views/table/index.vue"),
            meta: { title: "添加行" },
          },
        ],
      },
      {
        path: "/tabs",
        name: "tabs",
        component: () => import("@/views/tabs/index.vue"),
        meta: { icon: "el-icon-s-home", title: "静态资源动态导入" },
      },
      {
        path: "/lx",
        name: "lx",
        component: () => import("@/views/Lx.vue"),
        meta: { icon: "el-icon-s-home", title: "练习" },
      },
      {
        path: "/swiper",
        name: "swiper",
        component: LayoutRouterView,
        meta: { icon: "el-icon-picture", title: "轮播管理" },
        children: [
          {
            path: "/swiper/1",
            name: "swiper1",
            component: () => import("@/views/swiper/swiper.vue"),
            meta: { title: "轮播1" },
          },
          {
            path: "/swiper/2",
            name: "swiper2",
            component: () => import("@/views/swiper/swiper2.vue"),
            meta: { title: "轮播2" },
          },
          {
            path: "/swiper/3",
            name: "swiper3",
            component: () => import("@/views/swiper/swiper3.vue"),
            meta: { title: "轮播3" },
          },
        ],
      },
    ],
  },
];

const router = new VueRouter({
  mode: "hash", // history
  base: process.env.BASE_URL,
  routes,
});

export default router;
